import React, { Component } from 'react'
import { Route, Switch  } from 'react-router-dom'
import { IRoutes, loadable } from '../../routes'
import LoginMode from '../../store/action/LoginMode'

export default class LoginPage extends Component<any, any> {

    private router: IRoutes[] = [
        {
            component: import('../../store/action/Login'),
            path: '/loginMode/login'
        },
        {
            component: import('./AccountLogin'),
            path: '/loginMode/accountLogin'
        },
        {
            component: import('./UserRegister'),
            path: '/loginMode/userRegister'
        },
        {
            component: import('./RecoveredPsw'),
            path: '/loginMode/recoveredPsw'
        },
        {
            component: import('../../store/action/Login/WeChatLogin'),
            path: '/loginMode/weChatLogin'
        },
    ]

    public render (): JSX.Element {
        return (
            <React.Fragment>
                <Switch>
                    <Route path="/loginMode" exact={true} component={LoginMode}  />
                    {
                        this.router.map((item: IRoutes, index: number) => {
                            return <Route path={item.path} component={loadable(item.component)} key={index} />
                        })
                    }
                </Switch>
            </React.Fragment>
        )
    }
}